<template>
  <div class="PublicHead">
    <div class="content">
      <div class="left" @click="toHomepage()">
        <img src="../assets/img/logo.png" alt="">
      </div>
      <div class="right">
        <div class="headPortrait">
          <img src="../assets/img/login/user.png" alt="">
        </div>
        <div class="userInfo">
          <div class="userInfoTop">
            <p>{{ userInfo.username }}</p>
            <p class="el-dropdown-link">&nbsp;欢迎登录！</p>

            <!-- <el-badge :value="messageCount" v-if="isShow()">
      <el-tooltip content="点击查看通知">
        <i  class="el-icon el-icon-message" style="font-size: 20px;" @click="showNotification" ></i>
      </el-tooltip>
    </el-badge> -->
            <el-badge :value="messageCount" :hidden="jiaobiao()">
              <i class="el-icon el-icon-message" style="font-size: 20px;" @click="drawer = true"></i>
            </el-badge>
            <el-drawer :append-to-body="false" title="我的消息" :visible.sync="drawer">
              <!-- <span @click="messageCount==0">清除历史记录</span> -->
              <div class="message">
                <div v-if="Show.isRead == 0">
                  <div class="item" v-if="Show.isrenzhen == 1 || Show.isrenzhen == 2" id="oneitem">
                    <el-tag>{{ Show.isrenzhen == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color:  black;">您提交的企业认证{{ Show.isrenzhen == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;"
                        @click="togeren(0)">点我查看详情</i></i>
                  </div>
                </div>
                <div v-if="pingtaiRead == 0">
                  <div class="item" v-if="pingtaiState == 1 || pingtaiState == 2">
                    <el-tag>{{ pingtaiState == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color:  black;">您提交的申报-示范平台(国家级)审核{{ pingtaiState == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(1, 0, 0)">
                        {{ pingtaiState == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="pingtaiRead1 == 0">
                  <div class="item" v-if="pingtaiState1 == 1 || pingtaiState1 == 2">
                    <el-tag>{{ pingtaiState1 == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color:  black;">您提交的申报-示范平台(省级)审核{{ pingtaiState1 == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(1, 0, 1)">
                        {{ pingtaiState1 == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="pingtaiRead2 == 0">
                  <div class="item" v-if="pingtaiState2 == 1 || pingtaiState2 == 2">
                    <el-tag>{{ pingtaiState2 == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color:  black;">您提交的申报-示范平台(市级)审核{{ pingtaiState2 == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(1, 0, 2)">
                        {{ pingtaiState2 == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="jidiRead == 0">
                  <div class="item" v-if="jidiState == 1 || jidiState == 2">
                    <el-tag>{{ jidiState == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的申报-示范基地(国家级)审核{{ jidiState == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(1, 1, 0)">
                        {{ jidiState == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="jidiRead1 == 0">
                  <div class="item" v-if="jidiState1 == 1 || jidiState1 == 2">
                    <el-tag>{{ jidiState1 == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的申报-示范基地(省级)审核{{ jidiState1 == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(1, 1, 1)">
                        {{ jidiState1 == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="jidiRead2 == 0">
                  <div class="item" v-if="jidiState2 == 1 || jidiState2 == 2">
                    <el-tag>{{ jidiState2 == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的申报-示范基地(市级)审核{{ jidiState2 == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(1, 1, 2)">
                        {{ jidiState2 == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="jigouRead == 0">
                  <div class="item" v-if="jigouState == 1 || jigouState == 2">
                    <el-tag>{{ jigouState == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的申报-入驻机构审核{{ jigouState == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(1, 2, 3)">
                        {{ jigouState == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="nianshenPtread == 0">
                  <div class="item" v-if="nianshenPt == 1 || nianshenPt == 2">
                    <el-tag>{{ nianshenPt == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的年审-示范平台(国家级)审核{{ nianshenPt == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(2, 0, 0)">
                        {{ nianshenPt == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="nianshenPtread1 == 0">
                  <div class="item" v-if="nianshenPt1 == 1 || nianshenPt1 == 2">
                    <el-tag>{{ nianshenPt1 == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的年审-示范平台(省级)审核{{ nianshenPt1 == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(2, 0, 1)">
                        {{ nianshenPt1 == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="nianshenPtread2 == 0">
                  <div class="item" v-if="nianshenPt2 == 1 || nianshenPt2 == 2">
                    <el-tag>{{ nianshenPt2 == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的年审-示范平台(市级)审核{{ nianshenPt2 == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(2, 0, 2)">
                        {{ nianshenPt2 == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="nianshenJdread == 0">
                  <div class="item" v-if="nianshenJd == 1 || nianshenJd == 2">
                    <el-tag>{{ nianshenJd == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的年审-示范基地(国家级)审核{{ nianshenJd == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(2, 1, 0)">
                        {{ nianshenJd == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="nianshenJdread1 == 0">
                  <div class="item" v-if="nianshenJd1 == 1 || nianshenJd1 == 2">
                    <el-tag>{{ nianshenJd1 == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的年审-示范基地(省级)审核{{ nianshenJd1 == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(2, 1, 1)">
                        {{ nianshenJd1 == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="nianshenJdread2 == 0">
                  <div class="item" v-if="nianshenJd2 == 1 || nianshenJd2 == 2">
                    <el-tag>{{ nianshenJd2 == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的年审-示范基地(市级)审核{{ nianshenJd2 == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(2, 1, 2)">
                        {{ nianshenJd2 == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
                <div v-if="nianshenJgread == 0">
                  <div class="item" v-if="nianshenJg == 1 || nianshenJg == 2">
                    <el-tag>{{ nianshenJg == 1 ? '已通过' : '未通过' }}</el-tag>
                    <i style="color: black;">您提交的年审-入驻机构审核{{ nianshenJg == 1 ? '已通过' : '未通过' }},<i
                        style="text-decoration: underline;cursor: pointer;color:#409EFF;;" @click="togeren(2, 2, 3)">
                        {{ nianshenJg == 1 ? '点击查看详情' : '点击去修改' }}
                      </i></i>
                  </div>
                </div>
              </div>
            </el-drawer>
            <el-dropdown @command="handleCommand" style="cursor: pointer;">
              <i v-if="isShow()" style="font-size: 20px;margin-left: 10px;" class="el-icon-setting"></i>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item command="center">个人中心</el-dropdown-item>
                <el-dropdown-item command="logout">退出登录</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>

          <div class="userInfoFoot" v-if="isShow()">
            <p v-if="Show.isrenzhen == 0">待认证</p>
            <p v-if="Show.isrenzhen == 1">已认证</p>
            <p v-if="Show.isrenzhen == 2">未通过</p>
            <p v-if="Show.isrenzhen == 3">认证中</p>
            <p v-if="Show.isrenzhen == 0" @click="toRenzhen(0)" style="cursor: pointer;">去认证</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { user_renzheng, user_read, pingtai_Count, pingtai_read, nianshen_read, nianshen_setread } from '@/api/api';
export default {
  data() {
    return {
      userInfo: {
      },
      Show: {
        isShow: '',
        isrenzhen: '',
        isread: null
      },
      drawer: false,
      messageCount: null, // 角标上的消息数量
      notificationTitle: '信息', // 通知的标题
      notificationMessage: '您有 1 条未读消息', // 通知的内容
      pingtaiState: null,
      pingtaiRead: null,

      nianshenPt: null,
      nianshenPtread: null,

      pingtaiState1: null,
      pingtaiRead1: null,
      nianshenPt1: null,
      nianshenPtread1: null,

      pingtaiState2: null,
      pingtaiRead2: null,

      nianshenPt2: null,
      nianshenPtread2: null,

      jidiState: null,
      jidiRead: null,
      nianshenJd: null,
      nianshenJdread: null,

      jidiState1: null,
      jidiRead1: null,
      nianshenJd1: null,
      nianshenJdread1: null,

      jidiState2: null,
      jidiRead2: null,
      nianshenJd2: null,
      nianshenJdread2: null,

      jigouState: null,
      jigouRead: null,
      nianshenJg: null,
      nianshenJgread: null,
    }
  },

  mounted() {
    if (localStorage.getItem('token')) {
      const parts = localStorage.getItem('token').split('.');
      const decodedPayload = JSON.parse(atob(parts[1]));
      this.userInfo = decodedPayload
      user_renzheng({ id: this.$store.state.userId }).then((res) => {
        if (res.data.data.authentication_state == 1 || res.data.data.authentication_state == 2 || res.data.data.authentication_state == 3) {
          this.Show.isrenzhen = res.data.data.authentication_state
          this.Show.isRead = res.data.data.isRead
          if (res.data.data.isRead == 0) {
            this.messageCount = this.messageCount + 1
          }
        }
      })
      pingtai_Count({ userId: this.$store.state.userId, type: 0, level: 0 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.pingtaiState = res.data.data.pprovalStatus
            this.pingtaiRead = res.data.data.isRead
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
            console.log(this.pingtaiState, '平台国家级');
          }
        }
      })
      pingtai_Count({ userId: this.$store.state.userId, type: 0, level: 1 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.pingtaiState1 = res.data.data.pprovalStatus
            this.pingtaiRead1 = res.data.data.isRead
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      pingtai_Count({ userId: this.$store.state.userId, type: 0, level: 2 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.pingtaiState2 = res.data.data.pprovalStatus
            this.pingtaiRead2 = res.data.data.isRead
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      pingtai_Count({ userId: this.$store.state.userId, type: 1, level: 0 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.jidiState = res.data.data.pprovalStatus
            this.jidiRead = res.data.data.isRead
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      pingtai_Count({ userId: this.$store.state.userId, type: 1, level: 1 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.jidiState1 = res.data.data.pprovalStatus
            this.jidiRead1 = res.data.data.isRead
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      pingtai_Count({ userId: this.$store.state.userId, type: 1, level: 2 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.jidiState2 = res.data.data.pprovalStatus
            this.jidiRead2 = res.data.data.isRead
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      pingtai_Count({ userId: this.$store.state.userId, type: 2, level: 3 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.jigouState = res.data.data.pprovalStatus
            this.jigouRead = res.data.data.isRead
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      //============================================示范平台年审(国家级)
      nianshen_read({ userId: this.$store.state.userId, type: 0, level: 0 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.nianshenPt = res.data.data.pprovalStatus
            this.nianshenPtread = res.data.data.isRead
            console.log(this.nianshenPt, this.nianshenPtread, "年审");
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      //============================================示范平台年审(省级)
      nianshen_read({ userId: this.$store.state.userId, type: 0, level: 1 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.nianshenPt1 = res.data.data.pprovalStatus
            this.nianshenPtread1 = res.data.data.isRead
            console.log(this.nianshenPt1, this.nianshenPtread1, "年审2");
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      //============================================示范平台年审(省级)
      nianshen_read({ userId: this.$store.state.userId, type: 0, level: 2 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.nianshenPt2 = res.data.data.pprovalStatus
            this.nianshenPtread2 = res.data.data.isRead
            console.log(this.nianshenPt2, this.nianshenPtread2, "年审3");
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      //============================================示范基地(国家级)
      nianshen_read({ userId: this.$store.state.userId, type: 1, level: 0 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.nianshenJd = res.data.data.pprovalStatus
            this.nianshenJdread = res.data.data.isRead
            console.log(this.nianshenJd, this.nianshenJdread, "基地年审国家");
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      //============================================示范基地(省级)
      nianshen_read({ userId: this.$store.state.userId, type: 1, level: 1 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.nianshenJd1 = res.data.data.pprovalStatus
            this.nianshenJdread1 = res.data.data.isRead
            console.log(this.nianshenJd1, this.nianshenJdread1, "基地年审省级");
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      //============================================示范基地(市级)
      nianshen_read({ userId: this.$store.state.userId, type: 1, level: 2 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.nianshenJd2 = res.data.data.pprovalStatus
            this.nianshenJdread2 = res.data.data.isRead
            console.log(this.nianshenJd2, this.nianshenJdread2, "基地年审市级");
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
      //============================================入驻机构年审
      nianshen_read({ userId: this.$store.state.userId, type: 2, level: 3 }).then((res) => {
        if (res.data.data && res.data.data.pprovalStatus) {
          if (res.data.data.pprovalStatus == 1 || res.data.data.pprovalStatus == 2) {
            this.nianshenJg = res.data.data.pprovalStatus
            this.nianshenJgread = res.data.data.isRead
            console.log(this.nianshenJg, this.nianshenJgread, "入驻机构年审");
            if (res.data.data.isRead == 0) {
              this.messageCount = this.messageCount + 1
            }
          }
        }
      })
    }

  },
  methods: {
    //角标是否显示
    jiaobiao() {
      if (this.messageCount == 0) {
        return true
      }
      if (this.pingtaiState || this.jidiState || this.jigouState || this.Show.isrenzhen == 1 || this.Show.isrenzhen == 2) {
        return false
      } else {
        return true
      }
    },
    togeren(address, type, level) {
      if (address == 0) {
        user_read({ userId: this.$store.state.userId, isRead: 1 }).then((res) => {
          console.log(res);
        })
        this.$router.push('/gerenCenter/qydetail');
        setTimeout(() => {
          location.reload()
        }, 50)
      } else if (address == 1) {
        pingtai_read({ userId: this.$store.state.userId, type: type, level: level, isRead: 1 }).then((res) => {
          console.log(res);
        })
        this.$router.push('/gerenCenter/ptlist');
        setTimeout(() => {
          location.reload()
        }, 50)
      } else if (address == 2) {
        nianshen_setread({ userId: this.$store.state.userId, type: type, level: level, isRead: 1 }).then((res) => {
          console.log(res);
        })
        this.$router.push('/gerenCenter/nsdetail');
        setTimeout(() => {
          location.reload()
        }, 50)
      }
    },

    toHomepage() {
      this.$router.push('/login');
    },
    toRenzhen(num) {
      if (num == 0) {
        this.$router.push('/qiyerenzhen');
      } else if (num == 2) {
        document.querySelector('#oneitem').style.display = 'none'
        this.$router.push('/gerenCenter/qydetail');
      }
    },
    isShow() {
      return localStorage.getItem('token') ? true : false
    },
    handleCommand(command) {
      if (command === 'center') {
        if(this.Show.isrenzhen==0){
          this.$message.error('请先进行企业验证，正在为您跳转')
          setTimeout(()=>{
            this.$router.push('/qiyerenzhen')
          },1000)
        }else{
          this.$router.push('/gerenCenter/qydetail')
        }
       
      } else if (command === 'logout') {
        // 处理退出登录逻辑
        localStorage.removeItem('token')
        this.$router.push('/login');
        this.$store.commit('setuserId', '')
        this.$message({
          message: '退出登录成功',
          type: 'success',
        });
      }
    },



  }
}
</script>

<style scoped lang="scss">
.item {
  width: 100%;
  height: 50px;
  padding-left: 30px;
  line-height: 50px;
}

.el-drawer {
  width: 300px;
}

.el-icon {
  color: black;
  cursor: pointer;
}

.el-dropdown-link {
  color: #1285D7;
}

.PublicHead {
  height: 90px;
  background: #F8F8F8;
  width: 100%;
}

.content {
  width: 1220px;
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.left {
  img {
    width: 465px;
    height: 62px;
    cursor: pointer;
  }
}

.right {
  display: flex;

}

.right1 {
  display: flex;
  text-align: center;

  p {
    width: 50px;
  }

  p:nth-of-type(1) {
    width: 100%;
    height: 16px;
    font-size: 16px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    color: #007EC5;
  }

}

.userInfo {
  display: flex;
  flex-direction: column;
  justify-content: center;

  .userInfoTop {
    width: 100%;
    height: 17px;
    font-size: 15px;
    font-family: Arial;
    font-weight: 400;
    color: #1285D7;
    line-height: 20px;
    display: flex;
    align-items: center;

  }

  .userInfoFoot {
    width: 172px;
    height: 17px;
    font-size: 15px;
    font-family: Arial;
    font-weight: 400;
    color: #1285D7;
    display: flex;

    p:nth-of-type(1) {
      width: 71px;
      height: 26px;
      border: 1px solid #F39800;
      border-radius: 5px 5px 5px 5px;
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: bold;
      color: #F39800;
      text-align: center;
      line-height: 26px;
      margin: 5px 0px;
      margin-right: 10px;
    }

    p:nth-of-type(2) {
      width: 100%;
      height: 12px;
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: bold;
      color: #E9422D;
      line-height: 26px;
      margin: 5px 0px;
    }
  }
}

.headPortrait {
  margin-right: 10px;

  img {
    width: 69px;
    height: 69px;
  }
}
</style>